import React, { Component } from 'react'
import { connect } from 'react-redux'
import ComponentHead from '../../components/componenthead/componenthead'
import { baseUrl, shopcar } from '../../api/base'
import Shopcaritem from './shopcaritem/shopcaritem'
import './shopcar.less'
class Shopcar extends Component {
    state = {
        list: []
    }
    componentDidMount() {
        if (!this.props.user) {
            this.props.history.push('/login')
        }
        //请求网络数据
        fetch(baseUrl + shopcar)
            .then(res => res.json())
            .then(res => {
                console.log(res)
                this.setState({
                    list: res
                })
            })
    }
    render() {
        return (
            <div>
                <ComponentHead title='购物车' history={this.props.history} />
                <div className='yonghu'>
                    <p>
                        <i className='iconfont icon-wode'></i>
                        {this.props.user}
                    </p>
                    <p>
                        <i className='iconfont icon-htmal5icon14'></i>
                        {this.props.city}
                    </p>
                </div>
                <div>
                    {
                        this.state.list.length>0
                        ?
                        this.state.list.map((e,i)=>{
                            return <Shopcaritem key={i} data={e}/>
                        })
                        
                        :
                        <div>数据正在加载中</div>
                    }
                </div>
            </div>
        )
    }
}
function mapStateToProps(state) {
    return {
        city: state.city,
        user: state.user
    }
}
export default connect(mapStateToProps)(Shopcar)